<template>
	<view class="pd pt20 pm20 bgff box">
		<view class="pt10 pm10 display-flex fz30 z6">
			<view class="xczvrytxctrtr  vertical-center tl">
				反馈类型:
			</view>
			<view class="z3 flex-1">
				<radio-group @change="radioChange" class="">
					<label class="xzczxctrt mr20" v-for="(item, index) in items" :key="item.dictValue">
						<view class="display-flex">
							<view>
								<radio :value="item.dictValue" class="kcxzvxcdrytr" :checked="index === current" />
							</view>
							<view class="fz28 fgfdgdfgbty">{{item.dictLabel}}</view>
						</view>
					</label>
				</radio-group>
			</view>
		</view>
		<view class="pt10 pm10 display-flex fz30 z6">
			<view class="xczvrytxctrtr   tl pt20">
				反馈内容:
			</view>
			<view class="z3 flex-1">
				<textarea v-model="form.content" class="lxcxzfrerx br" placeholder="请输入反馈内容"></textarea>
			</view>
		</view>

		<view class="pt10 pm10 display-flex fz30 z6">
			相关截图({{jdfdsrt.length}}/5)
		</view>
		<view class="xcxzcsgfgfdgr mt20">
			<view class="pr czxcsderexcr" v-for="(sd,idx) in jdfdsrt">
				<image :src="sd" class="w100 h100 cz" mode="aspectFill"></image>
				<text class="iconfont icon-14CIRCLE clofdfdtrtrt" @tap="jjmxdsfsd"></text>
			</view>
			<view class="czxcsderexcr vertical-center" @tap="kxmcfdf" v-if="jdfdsrt.length<5">
				<text class="iconfont icon-zhaopian xzcertrxcr"></text>
			</view>
		</view>

	</view>


	<view class="pd">
		<view class="kxczxcstreszxr pd pt30 pm20 mt20 ">
			<view class="fz32 display-flex pr">
				<view class="flex-1">
					<text class="kkxczxerwt">个人信息</text>
				</view>
			</view>
			<view class="btm mt20 pt20">
				<view class="pt10 pm10 display-flex fz30 z6">
					<view class="xczvrytxctrtr  vertical-center tl">
						姓名:
					</view>
					<view class="z3 flex-1">
						<input type="text" v-model="ret.realName" class="kxcxzrtrtxr pl20" placeholder="请输入姓名" />
					</view>
				</view>

				<view class="pt10 pm10 display-flex fz30 z6">
					<view class="xczvrytxctrtr  vertical-center tl">
						企业:
					</view>
					<view class="z3 flex-1 pr">
						<picker @change="jjxczc" :range="arrayc">
							<text class="iconfont jjxzczfer icon-down"></text>
							<input type="text" disabled v-model="jmxze" class="kxcxzrtrtxr pr20 pl20"
								placeholder="请选择" />
						</picker>
					</view>
				</view>
				<view class="pt10 pm10 display-flex fz30 z6">
					<view class="xczvrytxctrtr  vertical-center tl">
						联系方式:
					</view>
					<view class="z3 flex-1 pr">

						<input type="text" v-model="ret.urgencyPhone" class="kxcxzrtrtxr pl20 pr20"
							placeholder="请输入联系方式" />
					</view>
				</view>


			</view>



		</view>

		<view class="mt100">
			<button type="primary" @tap="tiiadsrt">提交</button>
		</view>
	</view>
</template>
<script lang="ts" setup>
	import { ref } from "vue"
	import { upImg, hf, yzphone, callBack, zidianall, dxrequest } from "@/util/index.js"
	import { onLoad } from "@dcloudio/uni-app"
	const current = ref(0)
	const jdfdsrt = ref([])
	const jmxzc = ref("张三")
	const jmxzd = ref("13538190372")
	const jmxze = ref()
	const ret = ref()
	const arrayc = ref([])
	const unxczfc = ref()
	const imxzczxIdx = ref()
	const items = ref()
	const xczrerx = ref()
	const form = ref({
		contentTypeName: "",
		contentType: "",
		content: "",
		imgUrl: "",
		companyId: "",
		companyName: "",
		realName: "",
		userPhone: "",
		isPass: 1,
		type:5
	})

	const radioChange = (data) => {

		form.value.contentTypeName = items.value.filter(a => a.dictValue == data.detail.value)[0].dictLabel
		form.value.contentType = data.detail.value
		// ret.value.urgencyRelation = data.detail.value
	}
	const kxmcfdf = async () => {
		const dhsd = await upImg()
		jdfdsrt.value.push(dhsd.imgurl)
	}
	const jjmxdsfsd = (idx) => {
		jdfdsrt.value.splice(idx, 1)
	}
	const jjxczc = (data) => {
		imxzczxIdx.value = data.detail.value
		jmxze.value = arrayc.value[data.detail.value]
	}
	const getcsList = async () => {
		const { data } = await dxrequest("/api/tmcompany/option")
		data.map(a => {
			arrayc.value.push(a.name)
		})
		xczrerx.value = data
	}
	onLoad(async () => {
		const opinion_back = await zidianall("opinion_back")
		getcsList()
		items.value = opinion_back
		form.value.contentTypeName = opinion_back[0].dictLabel
		form.value.contentType = opinion_back[0].dictValue
		console.log(form.value)
		getuser()
	})
	const getuser = async () => {
		const openid = uni.getStorageSync("openid")
		const { data } = await dxrequest("/api/user/" + openid)
		ret.value = data

	}
	const tiiadsrt = async () => {
		if (!form.value.content) {
			uni.showToast({
				title: "请输入反馈内容!"
			})
			return
		}
		const jts = jdfdsrt.value.join(",")
		form.value.imgUrl = jts
		if (!jmxze.value) {
			uni.showToast({
				title: "请选择企业!"
			})
			return
		}
		form.value.companyId = xczrerx.value[imxzczxIdx.value].id
		form.value.companyName = jmxze.value
		form.value.realName = ret.value.realName
		form.value.userPhone = ret.value.urgencyPhone
		console.log(form.value)
		const jdf = await dxrequest("/api/userdata",form.value,"post")
		if(jdf.code==0){
			callBack()
		}
	}
</script>

<style scoped>
	.lxcxzfrerx {
		width: 100%;
		border-radius: 8rpx;
		padding: 20rpx;
		height: 200rpx;
	}

	.jjxzczfer {
		position: absolute;
		right: 20rpx;
		top: 20rpx;
	}
</style>